Relative Layout 就是相對布局,以相對位置的方式進行設計,先來看看實作例子。
以下例子為Relative Layout與Linear Layout 的結合應用。
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity"
android:paddingLeft="10dp" android:paddingRight="10dp" android:paddingTop="20dp" android:paddingBottom="100dp"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:text="Hello World!"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Hello World!"
android:layout_marginLeft="100dp"
android:layout_alignParentRight="true"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="200dp"
android:text="Hello World!"
android:layout_alignParentBottom="true"/>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:paddingTop="100dp"
tools:context=".MainActivity">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingLeft="10dp"
android:text="Hello World!" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingLeft="10dp"
android:text="Hello World!" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingLeft="10dp"
android:text="Hello World!" />
</LinearLayout>
</RelativeLayout>
實作結果為
補充說明:灰色大框線就是我在Relative Layout設定所需用到的版面範圍,而我把Linear Layout寫在Relative Layout的範圍裡面,所以會有三個Hello World!以垂直方式連續呈現。
margin與padding的差別:
android:layout_marginBottom 物件與下方的間距
android:layout_marginTop 物件與上方的間距
android:layout_marginLeft 物件與左邊的間距
android:layout_marginRight 物件與右邊的間距
android:paddingBottom 物件內下方的padding
android:paddingTop 物件內上方的padding
android:paddingLeft 物件內左邊的padding
android:paddingRight 物件內右邊的padding
今天教學到這邊,我們明天再見!